.ry1 {
	animation: roty1 1s ease-in-out;
	-webkit-animation:roty1 1s ease-in-out;
}

.ry2 {
	animation: roty2 1s ease-in-out;
	-webkit-animation:roty2 1s ease-in-out;
}

@keyframes roty1 {
	from {
		transform: rotateY(30deg);
		-webkit-transform: rotateY(30deg);
	}
	to {
		transform: rotateY(0deg);
		-webkit-transform: rotateY(0deg);
	}
}

@keyframes roty2 {
	from {
		transform: rotateY(-30deg);
		-webkit-transform: rotateY(-30deg);
	}
	to {
		transform: rotateY(0deg);
		-webkit-transform: rotateY(0deg);
	}
}
.tanx1{
	animation: tansx1  1s ease-in-out;
	-webkit-animation:tansx1  1s ease-in-out;
}

@keyframes tansx1 {
	from {
		transform: translateX(100px);
		-webkit-transform:  translateX(100px);
	}
	to {
		transform:translateX(0);
		-webkit-transform: translateX(0);
	}
}
.tanx2{
	animation: tansx2  1s ease-in-out;
	-webkit-animation:tansx2  1s ease-in-out;
}

@keyframes tansx2 {
	from {
		transform: translateX(-100px);
		-webkit-transform:  translateX(-100px);
	}
	to {
		transform:translateX(0);
		-webkit-transform: translateX(0);
	}
}

.rz1 {
	animation: rotz1 1s ease-in-out;
	-webkit-animation:rotz1 1s ease-in-out;
}

@keyframes rotz1 {
	from {
		transform: rotateZ(30deg);
		-webkit-transform: rotateZ(30deg);
	}
	to {
		transform: rotateZ(0deg);
		-webkit-transform: rotateZ(0deg);
	}
}

.rz2 {
	animation: rotz2 1s ease-in-out;
	-webkit-animation:rotz2 1s ease-in-out;
}

@keyframes rotz2 {
	from {
		transform: rotateZ(-30deg);
		-webkit-transform: rotateZ(-30deg);
	}
	to {
		transform: rotateZ(0deg);
		-webkit-transform: rotateZ(0deg);
	}
}
